import editorStyle from "../util/defaultStyle";
import {getShapeName} from '../util/clazz';

export default function (G6, payload) {
    let behavior = {
        getDefaultCfg() {
            return {};
        },
        getEvents() {
            return {
                'canvas:mousemove': 'onMouseMove',
                'canvas:mouseup': 'onMouseUp',
                'canvas:mouseleave': 'onMouseLeave',
            }
        },
        onMouseMove(e) {
            if (this.graph.get('addNodeDragging')) {
                let delegateShape = this.graph.get('addDelegateShape');
                const addModel = this.graph.get('addModel');

                const width = parseInt(addModel.size.split('*')[0]);
                const height = parseInt(addModel.size.split('*')[1]);
                const point = this.graph.getPointByClient(e.x, e.y);
                const x = point.x;
                const y = point.y;
                if (!delegateShape) {
                    const parent = this.graph.get('group');
                    delegateShape = parent.addShape('rect', {
                        attrs: {
                            width,
                            height,
                            x: x - width / 2,
                            y: y - height / 2,
                            ...editorStyle.nodeDelegationStyle,
                        }
                    });
                    delegateShape.set('capture', false);
                    this.graph.set('addDelegateShape', delegateShape);
                }
                delegateShape.attr({x: x - width / 2, y: y - height / 2});
                this.graph.paint();
                this.graph.emit('afternodedrag', delegateShape);
            }
        },
        onMouseUp(e) {
            if (this.graph.get('addNodeDragging')) {
                const p = this.graph.getPointByClient(e.clientX, e.clientY);
                this.addNode(p);
            }
        },

        onMouseLeave(e) {
            if (this.graph.get('addNodeDragging')) {
                this._clearDelegate();
                this.graph.emit('afternodedragend');
            }
        },
        _clearDelegate() {
            const delegateShape = this.graph.get('addDelegateShape');
            if (delegateShape) {
                delegateShape.remove();
                this.graph.set('addDelegateShape', null);
                this.graph.paint();
            }
            this.graph.emit('afternodedragend');
        },
        addNode(p) {
            const addModel = this.graph.get('addModel');
            const {clazz = 'ope'} = addModel;
            addModel.type = getShapeName(clazz);
            addModel.shape = getShapeName(clazz);
            if (addModel.type == 'start-node' || addModel.type == 'end-node'){
                let arr =  this.graph.findAll('node',(node)=>{
                    return node.getModel().type=='start-node' || node.getModel().type=='end-node'
                })
                if (arr.length>0){
                    if (arr.length == 2){
                        this.graph.emit('message',{type:'warn',msg: '一条工艺路线，仅允许一个开始/结束节点'})
                        this._clearDelegate();
                        return
                    }
                    if (arr[0].getModel().type == addModel.type){
                        this.graph.emit('message',{type:'warn',msg: `${addModel.type=='start-node'?'开始':'结束'}节点已存在,一条工艺路线，仅允许一个开始/结束节点`})
                        this._clearDelegate();
                        return
                    }

                }
            }


            const timestamp = new Date().getTime();
            const id = clazz + timestamp;
            const x = p.x;
            const y = p.y;
            if (this.graph.executeCommand) {
                this.graph.executeCommand('add', {
                    type: 'node',
                    addModel: {
                        ...addModel,
                        x: x,
                        y: y,
                        id: id,
                    },
                });
            } else {
                this.graph.add('node', {
                    ...addModel,
                    x: x,
                    y: y,
                    id: id,
                });
                if ('ope' === clazz  || 'path' === clazz || 'group' === clazz){
                    this.graph.setItemState(id, 'marked',true);
                }
            }
            this._clearDelegate();
        }
    }

    if(payload){
        behavior = {...behavior, ...payload}
    }

    G6.registerBehavior('dragPanelItemAddNode', behavior);
}
